<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>抽奖</title>
    <style>
        div{
            width: 200px ;
            height: 200px;
            margin: 50px auto;
        }
    </style>
</head>

<body>
    <div>
        <h3 id="name" class="screen">张三</h3>
        <button onclick="drawNames()"class="btn1">开始</button>
        <button onclick="stopTimer()" class="btn2">结束 </button>
    </div>
</body>
<script>
    let namesArray = ["张三","李四","王五","麻子","来福","富贵","小红","小兰","小智"];
    let str=document.getElementsByClassName('screen')[0];
    let Btn1=document.getElementsByClassName('btn1')[0];
    let Btn2=document.getElementsByClassName('btn2')[0];
    let timer = null;
    let i =0;
    Btn1.onclick=function(){
        timer =setInterval(function(){
            str.innerHTML=namesArray[i];
            i++;
            if(i==namesArray.length ){
                i=0;
            }
        },50)
    }
    Btn2.onclick =function(){
        clearInterval(timer);
    }
</script>
</html>